<style>
    .fixed-table-pagination .pagination-detail, .fixed-table-pagination div.pagination {
        margin-top: 0px;
        margin-bottom: 0px;
    }
</style>

<div class="container-fluid">
    <div class="row">
        <div class="panel panel-default" style="margin-bottom: 0px;">
            <div class="panel-heading" style="font-weight: bold">
                <span>在建工程信息</span>
            </div>
            <div class="panel-body">
                <div id="toolbar" style="margin-bottom: 5px;">
                    <div class="form-inline">
                        <button class="btn btn-info btn-sm" onclick="clickSearch()">
                            <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
                            查询
                        </button>
                        <button class="btn btn-primary btn-sm" onclick="constructionList.clickAdd()">新增</button>
                        <button class="btn btn-danger btn-sm" onclick="constructionList.clickDeleteAll()">批量删除</button>
                        <button class="btn btn-success btn-sm" onclick="importExcel()">导入Excel</button>
                        <button class="btn btn-success btn-sm" onclick="constructionList.clickExport()">导出Excel</button>
                    </div>
                </div>
                <table id="list-table"></table>
            </div>
        </div>
    </div>
</div>

<script>
    $(function () {
        // $("#year").flatpickr({dateFormat:'Y',altFormat:'Y'});
        var h = $(window).height();
        $("#list-table").bootstrapTable({
            url:'getConstructionList',
            method:'post',
            sidePagination: 'server',
            pagination:true,
            pageSize:20,
            pageList:[10,20,50],
            pageNumber:1,
            height:h - 210,
            columns:[{
                checkbox:true
            },{
                title:'工程编号',
                field:'CONS_NO',
                sortable:true
            },{
                title:'项目名称',
                field:'CONS_NAME',
                sortable:true
            },{
                title:'计划投资总额',
                field:'TOTAL_FEE',
                sortable:true
            },{
                title:'累计完成投资',
                field:'ACC_FEE',
                sortable:true,
            },{
                title:'开工日期',
                field:'START_DATE',
                sortable:true,
            },{
                title:'计划竣工日期',
                field:'PLAN_COMPLETE_DATE',
                sortable:true,
            },{
                title:'投入使用状况',
                field:'USE_STATE_NAME',
                sortable:true,
            },{
                title:'计划投入使用日期',
                field:'USE_DATE',
                sortable:true,
            },{
                title:'项目性质',
                field:'NATURE_NAME',
                sortable:true,
            },{
                title:'项目类型',
                field:'TYPE_NAME',
                sortable:true,
            },{
                title:'占地面积（㎡）',
                field:'BUILD_AREA',
                sortable:true,
            },{
                title:'坐落位置',
                field:'LOCATION',
                sortable:true,
            },{
                title:'操作',
                field:'CONS_ID',
                // halign:'center',
                align:'center',
                formatter:eval('constructionList.getButton')
            }],
            queryParams:function (params) {
                params.search = $("#search").val();
                params.year = $("#year").val();
                return params;
            },
            responseHandler:function (res) {
                console.log(res)
                return res;
            }
        });
    });

    var constructionList = {
        getButton:function (value,rowData,index) {
            var html1 = "<button class='btn btn-xs btn-default' CONS_ID='" + value + "' onclick='constructionList.onDetail(this)' style='margin: 2px;'>查看</button>";
            return html1;
        }
        ,onDetail:function (obj) {
            var consId = $(obj).attr('CONS_ID');
            var h = $(window).height()*0.9;
            var w = $(window).width()*0.9;
            layer.open({
                title:'查看在建工程',
                area:[w + 'px', h + 'px'],
                type:2,
                content:"{:url('editPage')}?consId=" + consId
            });
        }
        ,clickAdd:function () {
            var h = $(window).height()*0.9;
            var w = $(window).width()*0.9;

            layer.open({
                title:'新增在建工程',
                area:[w + 'px', h + 'px'],
                type:2,
                content:"{:url('addPage')}"
            });
        }
        ,clickDeleteAll:function () {

            var list = $("#list-table").bootstrapTable("getSelections");
            if(list.length < 1){
                layer.alert('请勾选要删除的工程',{icon:2});
                return;
            }

            var idList = [];
            for(var i = 0 ; i < list.length ; i++){
                idList.push(list[i]['CONS_ID']);
            }

            layer.confirm('确认删除选中的在建工程吗？',{icon:3},function (index) {
                layer.close(index);
                layer.load();
                $.ajax({
                    url:"{:url('deleteAll')}",
                    data:{list:idList},
                    success:function (res) {
                        layer.closeAll('loading');
                        var json = JSON.parse(res);
                        if(json['code'] == '200'){
                            layer.alert(json['msg'],{icon:1},function (index) {
                                layer.close(index);
                                constructionList.refreshTable();
                            });
                        }
                        else{
                            layer.alert(json['msg'],{icon:2});
                        }
                    },
                    error:function (res) {
                        layer.closeAll('loading');
                        layer.alert('网络错误',{icon:2});
                    }
                });
            });
        }
        ,clickExport:function () {
            var h = $(window).height()*0.8;
            var w = $(window).width()*0.8;
            if(w > 1200){
                w = 1200;
            }
            layer.open({
                title:'导出',
                area:[w + 'px', h + 'px'],
                type:2,
                content:"{:url('exportExcelPage')}"
            });
        },
        refreshTable:function () {
            $("#list-table").bootstrapTable('refresh');
        }
    };

    function refreshTable() {
        $("#list-table").bootstrapTable('refresh');
    }
    function clickSearch() {
        var h = $(window).height()*0.8;
        var w = $(window).width()*0.3;
        if(w > 1200){
            w = 1200;
        }
        layer.open({
            title:'查询--请输入查询条件',
            area:[w + 'px', h + 'px'],
            type:2,
            content:"{:url('searchPage')}"
        });
    }

    function importExcel() {
        var h = $(window).height()*0.8;
        var w = $(window).width()*0.8;
        if(w > 1200){
            w = 1200;
        }
        layer.open({
            title:'导入',
            area:[w + 'px', h + 'px'],
            type:2,
            content:"{:url('importPage')}",
            end:function () {
                refreshTable();
            }
        });
    }

</script>